<!-- 需求详情 -->
<template>
  <div class="common-pd-page demand-receiving-container">
    <demand-detail :textDatas="textDatas" :isShowInterviewBox="false">
      <template v-slot:back>
        <el-button type="primary" @click="onBack">返回</el-button>
      </template>
    </demand-detail>
    <template v-if="textDatas.isShowGetDemanded">
      <HPModuleTitle
        v-if="isAccept"
        :title-text="'供应商接收时间'"
      ></HPModuleTitle>
      <el-table
        v-if="isAccept"
        :data="getDemandedInfo"
        border
        fit
        stripe
        style="width: 100%"
        :class="'table-box'"
      >
        <el-table-column type="index" align="center" label="序号" width="80">
        </el-table-column>
        <el-table-column prop="supplierName" align="center" label="供应商">
        </el-table-column>
        <el-table-column prop="getDemaindTime" align="center" label="接收时间">
        </el-table-column>
      </el-table>
    </template>
  </div>
</template>
<script>
import HPModuleTitle from "@/components/HPModuleTitle";
import DemandDetail from "@/components/DemandDetail";
import { dec_demandDetail } from "@/decs/dec_interviewDemandDetail";
import { debounce } from 'lodash';
function getDemandDetailInfo(store, opts) {
  return store.dispatch("GET_DEMAND_DETAIL", opts);
}
function takeOverDemand(store, opts) {
  return store.dispatch("TAKE_OVER_DEMAND", opts);
}
export default {
  components: {
    HPModuleTitle,
    DemandDetail,
  },
  data() {
    return {
      needId: "",
      textDatas: {},
      getDemandedInfo: [],
      isDisableGetDemand: false,
      isShowGetDemanded: false,
      isShowGetDemandedBtn: true,
      isAccept: false, // 需求是否已接收
    };
  },
  beforeMount() {
    let id = this.$route.params.id;
    this.needId = id;
    this.state = this.$route.query.stus;
    let isClosed = false;
    if (this.state && this.state === "0") {
      // 待接收
      this.isShowGetDemanded = false;
      this.isShowGetDemandedBtn = true;
    } else {
      // 已接收
      if (this.state === "6") {
        // 已关闭
        isClosed = true;
      } else {
        isClosed = false;
      }
      this.isShowGetDemanded = true;
      this.isShowGetDemandedBtn = false;
    }
    getDemandDetailInfo(this.$store, { needId: this.needId }).then(() => {
      let tempObj = this.$store.getters.getDemandDetail;

      if (tempObj.state === "0000") {
        let tempData = tempObj.data;
        // 解构需求详情
        this.textDatas = dec_demandDetail(
          tempData,
          isClosed,
          this.isShowGetDemandedBtn,
          this.needId
        );
        this.isAccept = tempData.isAccept === 1 ? true : false; // 需求是否已接收
        this.getDemandedInfo.push({
          supplierName: tempData.supplierName,
          getDemaindTime: tempData.toDate,
        });
      } else {
        // this._showMessage("error", tempObj.message);
      }
    });
  },
  methods: {
    // 对说明数据进行解构
    desc_details: function (val) {
      let tempVal = [];
      if (val) {
        if (val.indexOf("\n") !== -1) {
          tempVal = val.split("\n");
        } else {
          tempVal.push(val);
        }
      } else {
        tempVal = [];
      }
      return tempVal;
    },
    takeOverDemandInfo: debounce(function() {
      let self = this;
      this.isDisableGetDemand = true;
      takeOverDemand(self.$store, { needId: self.needId }).then(() => {
        let tempObj = self.$store.getters.getTakeDemandedInfo;
        if (tempObj.state === "0000") {
          // 接收成功！
          self._showMessage("success", tempObj.message, function () {
            self.$router.push("/getdemand");
          });
        } else {
          // 接收失败
          this.isDisableGetDemand = false;
          this._showMessage("error", tempObj.message);
        }
      });
    }, 1000),
    cancleTakeOverDemand() {
      this.$router.push("/getdemand");
    },
    _showMessage(type, msg, fn) {
      this.$message({
        showClose: false,
        message: msg,
        type: type,
        duration: 1500,
        onClose: function () {
          if (fn instanceof Function) {
            fn();
          }
        },
      });
    },
    // * 返回
    onBack() {
      const { formQuery } = this.$route.query;
      this.$router.push({
        path: "/getdemand",
        query: {
          stus: this.state,
          formQuery,
        }
      });
    },
  },
};
</script>
<style lang="scss"></style>
